import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(home: SliverWidget()));
}

Widget SliverWidget() {
  return Material(
    child: CustomScrollView(
      slivers: <Widget>[
        // AppBar(title: const Text('App Name'),),
        SliverAppBar(
          pinned: true, //划到顶端会固定
          expandedHeight: 250.0,
          flexibleSpace: FlexibleSpaceBar(
            title: const Text('Demo'),
            background: Image.asset(
              "assets/images/img.png",
              fit: BoxFit.cover,
            ),
          ),
        ),
        SliverPadding(
          padding: const EdgeInsets.all(8.0),
          sliver: SliverGrid(
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2,
              mainAxisSpacing: 10.0,
              crossAxisSpacing: 10.0,
              childAspectRatio: 4.0,
            ),
            delegate: SliverChildBuilderDelegate(
                (context, index) {
                  return Container(
                    alignment: Alignment.center,
                    color: Colors.cyan[100 * (index % 9)],
                    child: Text('grid item $index'),
                  );
                },
              childCount: 20,
            ),

          ),
        ),
        SliverFixedExtentList(
          itemExtent: 50.0,
          delegate: SliverChildBuilderDelegate(
              (context, index) {
                return Container(
                  alignment: Alignment.center,
                  color: Colors.lightBlueAccent[100 * (index % 9)],
                  child: Text('list item $index'),
                );
              },
            childCount: 20
          ),
        ),
      ],
    ),
  );
}
